<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>智感桥安 - 道路光纤监测系统</title>
    <link rel="stylesheet" href="styles.css">
</head>
<body>
    <!-- 导航栏 -->
    <nav class="navbar">
        <div class="nav-container">
            <div class="nav-logo">
                <h2>智感桥安</h2>
                <span>道路光纤监测系统</span>
            </div>
            <ul class="nav-menu">
                <li class="nav-item active">
                    <a href="index.html" class="nav-link">首页</a>
                </li>
                <li class="nav-item">
                    <a href="diagram.html" class="nav-link">系统示意图</a>
                </li>
                <li class="nav-item">
                    <a href="metrics.html" class="nav-link">性能指标</a>
                </li>
                <li class="nav-item">
                    <a href="control.html" class="nav-link">控制面板</a>
                </li>
            </ul>
        </div>
    </nav>

    <!-- 主要内容 -->
    <main class="main-content">
        <!-- 英雄区域 -->
        <section class="hero">
            <div class="hero-content">
                <h1>跨区域桥梁AI健康动态监测与安全保障系统</h1>
                <p>基于光纤传感与人工智能技术的桥梁结构健康监测解决方案</p>
                <div class="hero-buttons">
                    <a href="diagram.html" class="btn btn-primary">查看系统</a>
                    <a href="control.html" class="btn btn-secondary">控制面板</a>
                </div>
            </div>
            <div class="hero-visual">
                <div class="bridge-animation">
                    <div class="bridge"></div>
                    <div class="sensor-points"></div>
                </div>
            </div>
        </section>

        <!-- 项目介绍 -->
        <section class="project-intro">
            <div class="container">
                <h2>项目简介</h2>
                <div class="intro-grid">
                    <div class="intro-card">
                        <div class="intro-icon">🎯</div>
                        <h3>项目目标</h3>
                        <p>构建跨区域桥梁AI健康动态监测与安全保障系统，实现桥梁结构的实时监测、智能诊断与主动预警。</p>
                    </div>
                    <div class="intro-card">
                        <div class="intro-icon">🔧</div>
                        <h3>核心技术</h3>
                        <p>采用光纤传感技术、深度学习算法(CNN-LSTM)和多源数据融合，实现高精度桥梁健康状态评估。</p>
                    </div>
                    <div class="intro-card">
                        <div class="intro-icon">📊</div>
                        <h3>应用场景</h3>
                        <p>适用于大中型公路桥梁、铁路桥梁及城市立交桥的结构健康监测与安全预警。</p>
                    </div>
                </div>
            </div>
        </section>

        <!-- 系统特点 -->
        <section class="features">
            <div class="container">
                <h2>系统特点</h2>
                <div class="features-grid">
                    <div class="feature-item">
                        <h3>实时监测</h3>
                        <p>7×24小时不间断监测桥梁结构状态，实时采集应力、位移、振动等关键参数。</p>
                    </div>
                    <div class="feature-item">
                        <h3>智能诊断</h3>
                        <p>基于深度学习的AI诊断模型，自动识别桥梁损伤并评估结构健康状态。</p>
                    </div>
                    <div class="feature-item">
                        <h3>区域联动</h3>
                        <p>实现跨区域多桥梁协同监测，识别区域性风险并联动预警。</p>
                    </div>
                    <div class="feature-item">
                        <h3>主动预警</h3>
                        <p>提前发现潜在安全隐患，通过多种方式向管理人员发送预警信息。</p>
                    </div>
                </div>
            </div>
        </section>
    </main>

    <!-- 页脚 -->
    <footer class="footer">
        <div class="container">
            <p>&copy; 2025 长安大学 - 智感桥安项目组. 版权所有.</p>
        </div>
    </footer>

    <script src="scripts.js"></script>
</body>
</html>